<script setup lang="ts">
import Theme from '@yang/components/theme'
const themeRef = ref()
const handTheme = () => {
  themeRef.value.showEdit()
}
</script>

<template>
  <div class="theme press-down" title="主题" @click="handTheme">
    <i class="esayIcon esayIcon-43_zhuti" style="font-size: 25px"></i>
  </div>
  <Theme ref="themeRef" />
</template>

<style scoped lang="scss">
.theme {
  cursor: pointer;
  height: 60px;
  padding: 0 10px;
  font-size: 12px;
  display: flex;
  align-items: center;
  &:hover {
    background: rgba(0, 0, 0, 0.04);
    i {
      animation: logoAnimation 0.3s ease-in-out;
    }
  }
}
</style>
